/* --------------------------控制主内容头部,start--------------- */
.main-header
  width 100%
  padding 5px 16px 10px
  box-sizing border-box
  display flex
  justify-content space-between
  background-color #fff
  border-bottom 1px solid #d9d7d7

  .title
    margin 5px 0 9px
    // margin 5px 0
    font-size 18px
    font-weight 400
    display flex
    align-items center
    color #6a8ebf

    > p
      cursor pointer

      span
        display inline-block
        margin 0 8px
        color #616266
        font-weight 700

    .black
      color #616266
      cursor default


  .icon-pagination
    padding 0 10px 0 0
    margin-top 10px
    display flex
    justify-content flex-end
    max-width 800px

    >.inputIcon
      flex 1
      display flex
      flex-wrap wrap
      position relative

      >li
        margin-right 15px

      .action-icon
        position absolute
        left -70px

.header-option
  display flex
  justify-content space-between
  align-items center
  padding-left 16px
  height 34px
  background-color #fff
  border-bottom 1px solid #cfcfcf
  .btn
    padding 4px 11px
    margin 5px 0

.main-header ~ .el-table   //  列表页才需要去除顶部边框，其他不去除
  border-top none !important
  height 100%
  .link
    cursor pointer
  .el-table__body tr:hover>td
    background-color #F5F5F5 !important
  .el-table__body td
    background-color #FCFCFC
    border-bottom 1px solid #DEE2E6
  th:first-child .cell, td:first-child .cell
    padding-left 6px
    padding-right 0
  .el-checkbox__input.is-indeterminate .el-checkbox__inner
    background-color white
  .el-table__body-wrapper
    height calc(100% - 46px)

/* --------------------------控制主内容头部,end--------------- */

/* --------------------------控制通用页面的样式(详情和添加),start--------------- */
.common-body-page
  display flex
  flex-direction column
  position relative

  >.option
    display flex
    justify-content space-between
    align-items center
    padding-left 16px
    height 34px
    border-bottom 1px solid #d9d7d7

  .has-viewer
    display flex
    flex 1
    overflow-y hidden
  .gc-body
    width 1200px
    margin 10px auto
    padding 20px 0 25px
    border 1px solid #d9d7d7
    background-color #fff
    box-sizing border-box
    overflow-y auto
    box-shadow 0px 0px 10px rgba(0, 0, 0, 0.047)

    .title
      font-size 32px
      color #333
      padding 0 30px
      font-weight 400
    
    .small-title
      font-size 16px
      margin-bottom 20px
      color #666

/* --------------------------控制通用页面的样式,end--------------- */

/* ------------------------组件公共样式,start------------------------ */
/* 输入框样式 */
.el-input__inner
  border 0
  border-bottom 1px solid #cfcfcf
  border-radius 0

/* element下拉菜单样式 */
.el-dropdown-link
  outline none
  cursor pointer

.el-dropdown-menu__item
  outline none

.el-popper[x-placement^="bottom"] .popper__arrow
  display none

/* element日期组件样式 */
.el-dropdown-menu
  padding 0

  .el-input__inner
    height 34px

/* element表格组件样式 */
.el-table
  border-top 1px solid #cfcfcf
  overflow inherit !important
  font-size 13px
  td,th
    padding 5px 10px
    border-bottom 1px solid #cfcfcf
    color #616266

  th.is-leaf
    border-bottom none
    background-color #fff
    font-weight 700
    color #666

  .el-table__body tr:hover>td
    background-color #e2e2e0!important

  .el-table__body tr td
    background-color #f9f9f9

  .el-table__body tr.el-table__row--striped td,.el-table__body tr.el-table__row--striped.current-row td, .el-checkbox__input.is-checked .el-checkbox__inner
    background-color #fff

    /* 表头阴影部分 */
  .el-table__header-wrapper
    box-shadow 0px 3px 10px rgba(153, 153, 153, 0.2)
    position relative
    z-index 1
    height 46px

    thead tr th .cell
      height 36px
      line-height 36px
  .radio-table .el-table-column--selection
    visibility hidden


/* element表单组件样式*/
.el-form
  display flex
  justify-content space-between
  flex-wrap wrap
  // margin-right：UI效果
  .el-form-item
    width 45%
    display flex
    margin-bottom 0
    margin-right 3%

  .el-form-item__label
    font-size 13px
    text-align left
    font-weight 600
    color #666
    width auto !important
    min-width 100px
    line-height 30px

  .el-form-item__content
    flex 1
    line-height 30px
    margin-left 10px

  .el-date-editor.el-input,  .el-select
    width 100%

  .el-icon-date
    font-size 13px

  .el-input__prefix
    left -5px

  .el-input__inner
    height 20px
    font-size 13px
    padding 0 0 6px
    padding-right 20px
    background-color transparent
  .el-input__inner.el-date-editor
    height 26px
    width 100%
    display flex
    padding-bottom 0
    .el-range__icon
      line-height 24px
  .el-input-group__append
    border none
    background #fff
    padding 0 5px
    cursor pointer

  .no-line .el-input__inner
    border 0
  .readonly
    .el-form-item__label
      color rgba(102, 102, 102, 0.498)

  .el-input--prefix .el-input__inner
    padding-left 30px

  .el-form-item.is-success .el-input__inner
    border-bottom 1px solid #ccc

  .el-form-item.is-required .el-form-item__label:before
    display none
    .el-form-item__content
      margin-left 0 !important
      textarea
        min-height 50px !important
        outline none
        border none
        border-bottom solid 1px #ccc
        border-radius 0
        padding 5px 0
        font-size 14px

  // 选择框箭头样式
  .el-select .el-input .el-select__caret
    color #666
    font-size 12px
    width auto
  // 日期选择框图标位置 
  .el-input__icon
    line-height 30px

  .el-textarea
    width 80% !important
    color #616266

    textarea
      border 0
      border-radius 0
      border-bottom solid 1px #ccc
      padding 5px 0
      min-height 70px !important

/* 按钮 */
.btn
  padding 6px 11px
  color #fff
  font-size 13px
  background-color #6a8ebf
  border 0
  outline none
  cursor pointer

  &:hover
    background-color #88a5cc
  &[disabled]
    background-color #b5c7df
    cursor not-allowed

.cancel-btn
  color #6A8EBF
  padding 6px 11px
  border 0
  cursor pointer
  outline none
  background-color #fff

  &:hover
    color #666
    background-color #E6E5E5

.font-red
  color  #F56C6C!important

/* element弹框样式 */
.el-dialog
  padding 15px 0 15px 0!important
  box-sizing border-box
  margin-top 5vh !important
  .el-dialog__header
    padding-left 30px
    .el-dialog__close
      font-size 12px
  .el-dialog__body
    padding 0 0 25px 0
  .el-dialog__footer
      border-top 1px solid #ccc
      padding 15px 30px 0
      text-align left
      .cancel-btn
        padding 6px
// 正常情况下的弹框，1200px
.big-dialog
  min-width 1200px
  .el-dialog__title
    font-size 30px
// 小弹框，一般用于温馨提示
.hit-dialog
  width 650px
  .el-dialog__header
    padding 0 15px 15px
    border-bottom 1px solid #ccc
  .el-dialog__body
    padding 0
    .text
      padding 15px 15px
      color #888
  .el-dialog__footer
    padding 10px 15px 0

.gc-body .el-checkbox.is-checked .el-checkbox__inner
  background-color #6a8ebf
  &:after
    border 2px solid #fff
    border-left 0
    border-top 0

input::placeholder
  color #d8d8d9

/* ------------------------组件公共样式,end------------------------ */


/* --------------------------公用样式,start--------------- */
.body   // 左右间隔
  margin 0 30px
  
.row  // 占一行
  width 100%!important
.wrap  // 换行，用于弹框的表单多行文本框换行
  flex-direction column
  .el-form-item__content
    margin-left 0
    .el-textarea
      width 700px !important
.add-more   // 蓝色小字体，可点击状态
  font-size 13px
  color #6A8EBF
  cursor pointer
  padding 0 30px

.self-tab // 表单标题样式
  margin 15px 0 10px
  height 30px
  line-height 30px
  color #6a8ebf
  font-size 13px
  font-weight 600
  border-bottom solid 1px #ccc
  position relative

  &:after
    content ''
    position absolute
    width 100px
    height 1px
    background-color #6a8ebf
    bottom -1px
    left 0

.error  // 错误提示样式
  width 100%
  padding 8px 15px
  box-sizing border-box
  font-size 14px
  background-color rgba(255, 241, 240, 1)
  margin-top 30px
  color #F56C6C

  .el-icon-error
    margin-right 5px

.small-table  // 详情页的表格样式
  margin-top 20px
  .el-table__header-wrapper
    height 30px
    thead tr th .cell
      height 18px
      line-height 15px
    thead th:first-child .cell
      padding-left 20px
  .el-table__body-wrapper
    tbody
      tr:hover>td
        background-color #f5f5f5 !important
      tr td
        background-color rgba(252, 252, 252, 1)
        border-bottom none
      tr td .cell
        min-height 15px !important
        line-height 15px
      tr td:first-child .cell
        padding-left 20px
  &::before
    content none
    
/* --------------------------公用样式,end--------------- */


/* -----------------------图标---------------------------*/
.el-icon-arrow-down:before
  content "\e600"

.el-icon-arrow-left:before
  content "\e601"

.el-icon-arrow-right:before
  content "\e602"

.el-icon-arrow-up:before
  content "\e603"

.el-icon-caret-bottom:before
  content "\e604"

.el-icon-sort-down:before
  content "\E604"

.el-select.el-select .el-input .el-select__caret:before, .el-icon-sort-up:before
  content "\E607"

.el-icon-caret-left:before
  content "\e605"

.el-icon-caret-right:before
  content "\e606"

.el-icon-caret-top:before
  content "\e607"

.el-icon-check:before
  content "\e608"

.el-icon-circle-check:before
  content "\e609"

.el-icon-circle-close:before
  content "\e60a"

.el-icon-circle-cross:before
  content "\e60b"

.el-icon-close:before
  content "\e60c"

.el-icon-upload:before
  content "\e60d"

.el-icon-d-arrow-left:before
  content "\e60e"

.el-icon-d-arrow-right:before
  content "\e60f"

.el-icon-d-caret:before
  content "\e610"

.el-icon-date:before
  content "\e611"

.el-icon-delete:before
  content "\e612"

.el-icon-document:before
  content "\e613"

.el-icon-edit:before
  content "\e614"

.el-icon-information:before
  content "\e615"

.el-icon-loading:before
  content "\e616"

.el-icon-menu:before
  content "\e617"

.el-icon-message:before
  content "\e618"

.el-icon-minus:before
  content "\e619"

.el-icon-more:before
  content "\e61a"

.el-icon-picture:before
  content "\e61b"

.el-icon-plus:before
  content "\e61c"

.el-icon-search:before
  content "\e61d"

.el-icon-setting:before
  content "\e61e"

.el-icon-share:before
  content "\e61f"

.el-icon-star-off:before
  content "\e620"

.el-icon-star-on:before
  content "\e621"

.el-icon-time:before
  content "\e622"

.el-icon-warning:before
  content "\e623"

.el-icon-delete2:before
  content "\e624"

.el-icon-upload2:before
  content "\e627"

.el-icon-view:before
  content "\e626"

.el-icon-success:before
  content "\E609"

.el-icon-error:before
  content "\E60b"